<template>
  <div>
    <el-row>
      <el-col :span="12">
        <el-button size="mini" plain type="primary" @click="onAddTemplate()"
          >新增</el-button
        >
        <el-button size="mini" plain type="primary" @click="openData()"
          >刷新</el-button
        >
        <el-button size="mini" plain type="primary" @click="onRefreshTemplate()"
          >刷新中间件微信消息模板</el-button
        >
      </el-col>
      <el-col :span="10">
        <div align="center" style="margin-top: 10px; color: red">
          当前微信AppID【{{ FWXAppID }}】
        </div>
      </el-col>
    </el-row>
    <div style="height: 15px"></div>

    <el-table ref="myTable" :data="FTemplateList" :height="FTableHeight">
      <el-table-column prop="FTemplateCode" label="配置代码" />
      <el-table-column prop="FWXAppID" label="微信AppID" />
      <el-table-column prop="FWXTemplateID" label="微信模板ID" />
      <el-table-column prop="FRemark" label="备注" />
      <el-table-column prop="FIsUse" label="启用">
        <template #default="scope">
          <el-switch disabled v-model="scope.row.FIsUse" />
        </template>
      </el-table-column>

      <el-table-column label="操作">
        <template #default="scope">
          <el-button
            type="primary"
            plain
            icon="el-icon-edit"
            size="mini"
            @click="onEditTemplate(scope.row)"
            >编辑</el-button
          >
          <el-button
            type="primary"
            plain
            icon="el-icon-edit"
            size="mini"
            @click="onDelTemplate(scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script lang="ts">
import WXAdminApi, { TWXTemplate } from "@/baselib/module/weixin/WXAdminApi";
import { IMenuItem } from "@/store";
import TFormBase from "@/views/BaseForm";
export default class TFormTemplateList extends TFormBase {
  declare $refs: {
    myTable: any;
  };
  private FTableHeight: number = 200;

  private FIndexTemplate: TWXTemplate = new TWXTemplate();
  private FTemplateList: TWXTemplate[] = [];
  //
  private FWXAppID: string = "";

  //
  public created() {
    this.FWXAppID = this.zIndexTag?.menuParams.WXAppID;
    if (this.$myStrHelper.stringIsEmptyYW(this.FWXAppID)) {
      this.$myMsgHelp.msgHintAutoClose("微信AppID不可为空");
      return;
    }
    this.openData();
  }
  private async openData() {
    var lResult = await WXAdminApi.GetTemplateList(this.FWXAppID);
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.FTemplateList = lResult.resultData;
    this.$myMsgHelp.msgHintAutoClose("打开数据成功");
  }
  public mounted() {
    //自适应列表高
    this.$nextTick(() => {
      if (this.$refs.myTable.$el != null) {
        this.FTableHeight =
          window.innerHeight - this.$refs.myTable.$el.offsetTop - 150;
      }
    });
    window.addEventListener("resize", () => {
      this.$nextTick(() => {
        if (this.$refs.myTable.$el != null) {
          this.FTableHeight =
            window.innerHeight - this.$refs.myTable.$el.offsetTop - 150;
        }
      });
    });
  }

  private onAddTemplate() {
    let lTag: IMenuItem = {
      menuIndexName: "TFormTemplateEidt_" + Date.UTC.toString(),
      menuComponent: "TFormTemplateEidt",
      menuTitle: "微信模板消息配置",
      menuIcon: "",
      menuParams: { WXAppID: this.FWXAppID, ID: "" }, //参数
      menuChildren: [],
    };
    this.$myEvenBus.addTag(lTag);
  }
  private onEditTemplate(qItem: TWXTemplate) {
    let lTag: IMenuItem = {
      menuIndexName: "TFormTemplateEidt_" + qItem.FID,
      menuComponent: "TFormTemplateEidt",
      menuTitle: "微信模板消息配置",
      menuIcon: "",
      menuParams: { WXAppID: this.FWXAppID, ID: qItem.FID }, //参数
      menuChildren: [],
    };
    this.$myEvenBus.addTag(lTag);
  }
  private async onDelTemplate(qItem: TWXTemplate) {
    let lConfirm = await this.$myMsgHelp.msgDialogConfirm(
      "确定要删除此微信消息模板？"
    );
    if (!lConfirm) {
      return;
    }
    let lResult = await WXAdminApi.DelTemplate(qItem.FID);
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    let lIndxe = this.FTemplateList.findIndex((item) => {
      return item.FID == qItem.FID;
    });
    if (lIndxe >= 0) {
      this.FTemplateList.splice(lIndxe, 1);
    }
  }
  private async onRefreshTemplate() {
    var lResult = await WXAdminApi.RefreshTemplate();
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.$myMsgHelp.msgHintAutoClose("刷新中间件模板成功");
  }
}
</script>

